<template>
  <div class="main">
    <!-- <h3>任务管理</h3> -->
    <el-card class="box-card">
      <div slot="header" class="clearfix">
      </div>
      <div class="text item">
        <template>
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column
              fixed
              type="index"
              label="序号"
              width="50"
              align="center"
            >
            </el-table-column>
            <el-table-column prop="projectName" label="项目名称" align="center">
            </el-table-column>
            <el-table-column prop="taskName" label="任务名称" align="center">
            </el-table-column>
            <el-table-column prop="taskType" label="任务类别" width="120" align="center" :formatter="typeFmt">
            </el-table-column>
            <el-table-column prop="taskDetail" label="任务内容" align="center">
            </el-table-column>            
            <el-table-column
              prop="createTime"
              custom
              label="创建时间"
              align="center"
            >
            </el-table-column>

            <el-table-column label="操作" width="260" align="center">
              <template slot-scope="scope">
                <el-button
                  @click="handleClick(scope.row.taskId)"
                  type="primary"
                  size="small"
                  plain
                  v-hasPermi="['system:task:detail']"
                  >查看详情</el-button
                >
                <el-button
                  @click="handleEval(scope.row.taskId)"
                  type="success"
                  v-if="scope.row.taskStatus == 'checked'"
                  v-hasPermi="['system:task:evaluate']"
                  size="small"
                  plain
                  >评价</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="total > 0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
          />
        </template>
      </div>
    </el-card>
    <evalForm ref="evalForm"></evalForm>
  </div>
</template>

<script>
import evalForm from './evalForm.vue';
import {
  listEvaluatorTask,
  getTask,
  taskTypesMap,
} from "@/api/system/task";
export default {
  components: {
    evalForm
  },
  data() {
    return {
      tableData: [],
      //总条数
      total: 0,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        roleName: undefined,
        roleKey: undefined,
        status: 'checked'
      },
      taskTypes:{}
    };
  },
  created() {
    this.init();
  },
  methods: {

    init() {
      taskTypesMap().then(res=>{
        this.taskTypes = res.data;
      });      
      listEvaluatorTask(this.addDateRange(this.queryParams, this.dateRange)).then(
        res => {
          // console.log(res);
          if (res.code == 200) {
            // this.$message.success(res.msg);
            this.total = res.total;
            this.tableData = res.rows;
          } else {
            this.$message.error(res.msg);
          }
        }
      );
    },

    typeFmt(row, column, value){
      return this.taskTypes[value];
    },
    getList() {
      this.loading = true;
      this.init();
    },
    handleClick(taskId) {
      this.$router.push({
        path: "/task/detail",
        query: { taskId }
      });
    },

    handleEval(id) {
      getTask(id).then(res=>{
        this.$refs.evalForm.ruleForm = res.data;
        // this.$refs.evalForm.attachments = [];
        // if(res.data.files){
        //   let files = res.data.files;
        //   for(let f of files){
        //     this.$refs.evalForm.attachments.push({id:f.fileId, name: f.fileName, url: f.filePath, size: f.fileSize });
        //   }
        // }
        this.$refs.evalForm.open();
      });
      
    },
  }
};
</script>

<style>
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}

.box-card {
  width: 100%;
}
</style>
